<template>
	<div>
		<!-- <div class="flex justify_content_between">
			<el-button size="small" type="primary" @click="add">创建</el-button>
			<div class="flex align_items_center">
				<span class="m_r_10">语言:</span>
				<el-select v-model="language" size="small" @change="getTableData">
					<el-option label="cn" value="cn">cn</el-option>
					<el-option label="en" value="en">en</el-option>
				</el-select>
			</div>
		</div> -->
		<div class="flex justify_content_between align_items_center  content-wrapper p_lr_20 m_b_20">
			<div>
				<h2>新闻资讯</h2>
			</div>
			<div>
				<Language></Language>
			</div>
		</div>

		<div  class="content-wrapper p_20 ">
		<!-- -项目列表- -->
			<div class="back">
				<div class="d1" style="top:200px;left:388px"  @click="edit('text1')">{{this.tableData.text.text1}}</div>
				<div class="d1" style="top:193px;left:620px"  @click="edit('text2')">{{this.tableData.text.text2}}</div>
				<div class="d1" style="top:132px;left:794px"  @click="edit('text3')">{{this.tableData.text.text3}}</div>
				<div class="d1" style="top:300px;left:519px"  @click="edit('text4')">{{this.tableData.text.text4}}</div>
				<div class="d1" style="top:470px;left:333px"  @click="edit('text5')">{{this.tableData.text.text5}}</div>
				<div class="d1" style="top:528px;left:464px"  @click="edit('text6')">{{this.tableData.text.text6}}</div>
				<div class="d1" style="top:584px;left:647px"  @click="edit('text7')">{{this.tableData.text.text7}}</div>
				<div class="d1" style="top:472px;left:891px"  @click="edit('text8')">{{this.tableData.text.text8}}</div>
				<div class="d1" style="top:591px;left:962px"  @click="edit('text9')">{{this.tableData.text.text9}}</div>
				<div class="d1" style="top:376px;left:1088px" @click="edit('text10')">{{this.tableData.text.text10}}</div>
				<div class="d1" style="top:227px;left:1038px" @click="edit('text11')">{{this.tableData.text.text11}}</div>
				<div class="d1" style="top:94px;left:1072px"  @click="edit('text12')">{{this.tableData.text.text12}}</div>
				
			</div>
			
			
		<Edit ref="Edit"></Edit>
		</div>
	</div>
</template>
<script type="text/javascript">
	import methods from './method'
	import Edit from './edit/edit'

	export default {
		data() {
			return {
				tableData: {
					text:{
						text1:'',
						text2:'',
						text3:'',
						text4:'',
						text5:'',
						text6:'',
						text7:'',
						text8:'',
						text9:'',
						text10:'',
						text11:'',
						text12:'',
					}
				}, //列表数据
				total: '', //数据总条数  
				language:'cn',
				id:1,
			}
		},
		methods: methods,
		components:{
			Edit
		},
		mounted() {
			this.getTableData()
		}
	}
</script>

<style scoped>
	.back {
		height: 800px;
		width: 1500px;
		background: url(../../../assets/imgs/salary.jpg) no-repeat;
		background-size: contain;
		position: relative;
	}
	
	.back div {
		position: absolute;
		color:#fff;
		/* padding: 10px; */
		box-sizing: border-box;
		border: 1px solid #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
		/* font-size: 12px; */
		text-align: center;
	}
	
	.back .d1 {
		width: 80px;
		height: 80px;
		border-radius: 50%;
	}
</style>